// 页面加载后调用函数
window.onload = function () {
  time()
  timeNumber()
  examXR()
  let login = JSON.parse(localStorage.getItem('login'))
  if (login == 1) {
    alert('请先登录')
    window.location.href = 'login.html'
  }
}
// 拉条时间
function time() {
  document.querySelector('.examTime').innerHTML = `时间:${document.querySelector('input[type=range]').value}`
}
document.querySelector('input[type=range]').addEventListener('change', function () {
  time()
})

//输入题库数量判断
document.querySelector('.number1').addEventListener('blur', function () {
  that = this
  numberPd()
})
document.querySelector('.number2').addEventListener('blur', function () {
  that = this
  numberPd()
})
document.querySelector('.number3').addEventListener('blur', function () {
  that = this
  numberPd()
})
document.querySelector('.number4').addEventListener('blur', function () {
  that = this
  numberPd()
})
function numberPd() {
  if (that.value < 0) {
    alert('题目数量不能为负数')
    that.value = 0
  } else if (that.value > that.max) {
    alert('题目数量大于题库的数量')
    that.value = 0
  }
}

// 数据渲染
let danIDs = []
let duoIDs = []
let tktIDs = []
let jdtIDs = []
let select = document.querySelector('#user')

// 
function timeNumber() {
  let danxt = document.querySelector('.add .add-danXT')
  let duoxt = document.querySelector('.add .add-duoXT')
  let tiankt = document.querySelector('.add .add-tkT')
  let jiandt = document.querySelector('.add .add-jdT')
  let danxt1 = document.querySelector('.number1')
  let duoxt1 = document.querySelector('.number2')
  let tiankt1 = document.querySelector('.number3')
  let jiandt1 = document.querySelector('.number4')
  // 数据获取
  let TiMuarr = JSON.parse(localStorage.getItem('TMU')) || []
  let dan = 0
  let duo = 0
  let tkt = 0
  let jdt = 0
  // 题型分类
  for (mes of TiMuarr) {
    if (mes.type === '单选题') {
      dan++
      danIDs.push(mes.ID)
    }
    if (mes.type === '多选题') {
      duo++
      duoIDs.push(mes.ID)
    }
    if (mes.type === '填空题') {
      tkt++
      tktIDs.push(mes.ID)
    }
    if (mes.type === '简答题') {
      jdt++
      jdtIDs.push(mes.ID)
    }

  }
  // 各个题目的数量
  danxt.innerText = `单选题：${dan}`
  duoxt.innerText = `多选题：${duo}`
  tiankt.innerText = `填空题：${tkt}`
  jiandt.innerText = `简答题：${jdt}`

  // 题目的最大数量
  danxt1.max = dan
  duoxt1.max = duo
  tiankt1.max = tkt
  jiandt1.max = jdt

  // 学生渲染
  let userarr = JSON.parse(localStorage.getItem('user'))
  for (mes of userarr) {
    if (mes.userType === '学生') {
      let option = document.createElement('option')
      option.innerHTML = `${mes.username}`
      select.appendChild(option)
    }
  }
}

// 创建考试按钮
document.querySelector('.createExam').addEventListener('click', function () {
  let stuName = []
  // 学生的名字选择
  let options = select.options
  for (i in options) {
    if (options[i].selected) {
      stuName.push(options[i].text)
    }
  }
  if (select.selectedIndex !== -1) {
    // 选中的题目
    let danxt1 = document.querySelector('.number1')
    let duoxt1 = document.querySelector('.number2')
    let tiankt1 = document.querySelector('.number3')
    let jiandt1 = document.querySelector('.number4')
    // 创建一个数组存储考题目
    let examTopic = JSON.parse(localStorage.getItem('exam')) || []
    // 考试ID
    let random = new Date().getMilliseconds()
    // console.log(random)
    // 创建对象
    let obj = {
      examID: random,
      user: stuName.join(','),
      danxuan: danIDs.slice(0, danxt1.value).join(','),
      duoxuan: duoIDs.slice(0, duoxt1.value).join(','),
      tiankon: tktIDs.slice(0, tiankt1.value).join(','),
      jianda: jdtIDs.slice(0, jiandt1.value).join(','),
      limitTime: document.querySelector('input[type=range]').value,
      examState: '开启',
      numbers: +danxt1.value + + duoxt1.value + + tiankt1.value + +jiandt1.value
    }
    examTopic.push(obj)
    localStorage.setItem('exam', JSON.stringify(examTopic))
    examXR()
  } else {
    alert('请选择考生')
  }

})

// 渲染表格
let tbody = document.querySelector('.add-exam')
function examXR() {
  tbody.innerHTML = ''
  let arr = JSON.parse(localStorage.getItem('exam')) || []
  let i = 0
  for (mes of arr) {
    i++
    let tr = document.createElement('tr')
    tr.innerHTML = `
        <td>${mes.examID}</td>
        <td>${mes.user}</td>
        <td>${mes.danxuan}</td>
        <td>${mes.duoxuan}</td>
        <td>${mes.tiankon}</td>
        <td>${mes.jianda}</td>
        <td>
           <span class='state' data-id="${i - 1}">状态：${mes.examState}</span>
           <br>
           <span>限时：${mes.limitTime}</span>
        </td>
        <td>
           <button class="qh" data-id="${i - 1}">切换状态</button>
           <button class="del" data-id="${i - 1}">删除</button>
        </td>
   `
    tbody.appendChild(tr)
  }
}

// 切换状态、删除事件委托
tbody.addEventListener('click', function (e) {

  let arr = JSON.parse(localStorage.getItem('exam')) || []
  console.log(e.target.className)
  // 切换
  if (e.target.className == 'qh') {
    if (arr[e.target.dataset.id].examState === '关闭') {
      arr[e.target.dataset.id].examState = '开启'
    } else {
      arr[e.target.dataset.id].examState = '关闭'
    }
    localStorage.setItem('exam', JSON.stringify(arr))
    examXR()
  }
  // 删除
  if (e.target.className == 'del') {
    if (confirm('确定删除考试吗？')) {
      arr.splice(e.target.dataset.id, 1)
      localStorage.setItem('exam', JSON.stringify(arr))
      examXR()
    }
  }
})
